﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        console.log("string anchor(name: string):生成带name属性的<a>标签");
        console.log("hello world!!!".anchor("lableName"));
        console.log("\r\n");

        console.log("string big():生成<big>标签");
        console.log("hello world!!!".big());
        console.log("\r\n");

        console.log("string blink():生成<blink>标签");
        console.log("hello world!!!".blink());
        console.log("\r\n");

        console.log("string bold():生成<b>标签");
        console.log("hello world!!!".bold());
        console.log("\r\n");

        console.log("string charAt(pos: number):返回指定索引位置的字符串");
        console.log("hello world!!!".charAt(0));
        console.log("hello world!!!".charAt(-1) == "");
        console.log("\r\n");

        console.log("number | undefined codePointAt(pos: number):返回指定位置字符的UTF-16数值,可用String.fromCharCode()转换为字符");
        let codePointAt = "hello world!!!".codePointAt(0);
        console.log("ASCII:", codePointAt, "=", String.fromCharCode(codePointAt), " ");
        console.log("hello world!!!".codePointAt());
        console.log("hello world!!!".codePointAt(-1));//undefined
        console.log("\r\n");

        console.log("string concat(...strings: string[]):将多个字符串或字符串数组连接成新的字符串");
        console.log("hello world!!!".concat([" world!", "good morning!"], "hello!", "hi"));
        console.log("\r\n");

        console.log("boolean endsWith(searchString: string, endPosition?: number):判断是否以某个字符串结尾,endPosition指从[0,endPosition]的字符");
        console.log("hello world!!!".endsWith("!!!"));
        console.log("hello world!!!".endsWith("!!!", 4));
        console.log("hello world!!!".endsWith("!!!", 50));
        console.log("\r\n");

        console.log("string fixed():生成<tt>标签");
        console.log("hello world!!!".fixed());
        console.log("\r\n");

        console.log("string fontcolor(color: string):生成color属性的<font>标签");
        console.log("hello world!!!".fontcolor("red"));
        console.log("\r\n");

        console.log("string fontsize(size: number):生成size属性的<font>标签");
        console.log("string fontsize(size: string)");
        console.log("hello world!!!".fontsize(25));
        console.log("hello world!!!".fontsize("25"));
        console.log("\r\n");

        console.log("boolean includes(searchString: string, position?: number):判断是否包含某个字符串,position:[position,end]范围的字符");
        console.log("hello world!!!".includes("world"));
        console.log("hello world!!!".includes("hello", 5));
        console.log("\r\n");

        console.log("number indexOf(searchString: string, position?: number):获取某个字符串第一次出现的索引位置,position:[position,end]范围的字符");
        console.log("hello world!!!".indexOf("!!"));
        console.log("hello world!!!".indexOf("hello", 6));
        console.log("\r\n");

        console.log("string italics():生成<i>标签");
        console.log("hello world!!!".italics());
        console.log("\r\n");

        console.log("number lastIndexOf(searchString: string, position?: number):获取某个字符最后一次出现的位置,position:[0,position]");
        console.log("hello world world!!!".lastIndexOf("world"));
        console.log("hello world!!!".lastIndexOf("world", 5));
        console.log("hello world!!!".lastIndexOf("world", 10));
        console.log("hello worldworld!!!".lastIndexOf("world", 100));
        console.log("\r\n");

        console.log("string length:字符串长度");
        console.log("hello world!!!".length);
        console.log("\r\n");

        console.log("string link(url: string):生成带链接的<a>标签");
        console.log("hello world!!!".link("www.baidu.com"));
        console.log("\r\n");

        console.log("number localeCompare(that: string, locales?: string | string[], options?: Intl.CollatorOptions):判断(默认)语言环境下两字符是否相等 left[index] - right[index] [>] | [=] | [<] 0");
        console.log("hello world!!!".localeCompare("hello world!!!"));
        console.log("hello world!!!".localeCompare("!!!"));
        console.log("123".localeCompare("321"));
        console.log("123".localeCompare("123"));
        console.log("321".localeCompare("123"));
        console.log("123000".localeCompare("321"));
        console.log("\r\n");

        console.log("RegExpMatchArray | null match(matcher: { [Symbol.match](string: string): RegExpMatchArray | null; }):使用正则表达式匹配字符串");
        console.log("hello world!!!".match(/\w+/).length);
        console.log("\r\n");

        console.log('string normalize(form: "NFC" | "NFD" | "NFKC" | "NFKD"):');
        console.log('normalize(form?: string):');
        console.log("\r\n");

        console.log("string repeat(count: number):");
        console.log("hello world!!!".repeat(6));
        console.log("\r\n");

/*
  [总结javascript replace高级用法-javascript replace高级用法教程-码农之家 (xz577.com)](https://www.xz577.com/j/17912.html)
*/
/**
| 参数 | 含义                                       |
| ---- | ------------------------------------------ |
| $$   | 插入一个 $                                 |
| $&   | 插入匹配的子串                             |
| $`   | 插入当前匹配的子串左边的内容               |
| $’  | 插入当前匹配的子串右边的内容               |
| $n   | 获取第n个获取到的子串，同上面的 p1,p2,…,pn |
*/
        console.log("string replace(searchValue: { [Symbol.replace](string: string, replacer: (substring: string, ...args: any[]) => string): string; }, replacer: (substring: string, ...args: any[]) => string): ");
        console.log("string replace(searchValue: { [Symbol.replace](string: string, replaceValue: string): string; }, replaceValue: string): ");
        console.log("hello world!!!".replace("hello", "hi"));
        console.log("javascript is a good script language".replace(/(javascript)\s*(is)/g, "$1 $2 fn.it $2"));/* 分组替换 */
        console.log("abbcccdeee".replace(/(\w)\1+/g, "$1"));/* 去除连续重复的字符串 使用重复的正则表达式 */
        let times = 0;
        console.log("Tomorrow may not be better, but better tomorrow will surely come!".replace(/\b\w+\b/gi, function (matchStr) {
/**
参数依次为：
    1、整个正则表达式所匹配到的字符串
    2、第一个分组匹配到的字符串，第二个分组所匹配到的字符串....依次类推一直      到最后一个分组
    3、此次匹配在源字符串中的下标，返回的是第一个匹配到的字符的下标
    4、源字符串
*/
            times++;
            console.log(arguments[arguments.length - 1]);
            return matchStr.substr(0, 1).toUpperCase() + matchStr.substr(1);
        }), "\r\n调用次数:", times);
        console.log(
            '<div><span>名称：</span><span>{{name}}</span></div><div><span>导演：</span><span>{{protagonist}}</span> </div>'
                .replace(/{{(\w+)}}/g, function (matchingStr, group1) {
                    console.log(group1, "---", { name: "功夫", protagonist: "周星驰" }[group1]);
                    return { name: "功夫", protagonist: "周星驰" }[group1];
                })
        );
        console.log(
            "i am a good man".replace(/good/g, "$&")/* 获取与正则表达式进行匹配的源字符串 */
        );
        console.log(
            "i am a good man".replace(/good/g, "$&-$&")/* 获取正则表达式匹配到的字符 */
        );
        console.log(
            "javascript is a good script".replace(/script/, "-$`")/* 获取正则匹配的左边的字符 */
        );
        console.log(
            "javascript is a good script".replace(/script/, " is a good language!it$'")/* 获取正则匹配的右边的字符 */
        );
        console.log("\r\n");

        console.log("number search(searcher: { [Symbol.search](string: string): number; }):查找字符串或正则索引位置");
        console.log("hello world!!!hello world!!!".search("world"));
        console.log("hello world!!!hello world!!!".search("!"));
        console.log("hello world!!!hello world!!!".search(/\W/g));
        console.log("\r\n");

        console.log("string slice(start?: number, end?: number):截取子串");
        console.log("hello world!!!".slice(0,5));
        console.log("hello world!!!".slice(0, this.length-3));
        console.log("hello world!!!".slice(0,-7));
        console.log("\r\n");

        console.log("string small():生成<small>标签");
        console.log("hello world!!!".small());
        console.log("\r\n");

        console.log("string[] split(splitter: { [Symbol.split](string: string, limit?: number): string[]; }, limit?: number):分割字符串");
        console.log("hello world!!!".split(" "));
        console.log("hello world!!!".split("world"));
        console.log("hello world!!!".split("world",1));
        console.log("\r\n");

        console.log("boolean startsWith(searchString: string, position?: number):判断是否以某个串开头");
        console.log("hello world!!!".startsWith("hello"));
        console.log("hello world!!!".startsWith("hello",5));
        console.log("\r\n");

        console.log("string strike():生成<strike>标签");
        console.log("hello world!!!".strike());
        console.log("\r\n");

        console.log("string sub():生成<sub>标签");
        console.log("hello world!!!".sub());
        console.log("\r\n");

        console.log("string substr(from: number, length?: number):截取子串");
        console.log("hello world!!!".substr(0, 5));
        console.log("hello world!!!".substr(0, 80));
        console.log("\r\n");

        console.log("string substring(start: number, end?: number):截取子串");
        console.log("hello world!!!".substring(0));
        console.log("hello world!!!".substring(0, 11));
        console.log("\r\n");

        console.log("string sup():生成<sup>标签");
        console.log("hello world!!!".sup());
        console.log("\r\n");

        console.log("string toLocaleLowerCase():略");
        console.log("string toLocaleUpperCase():略");
        console.log("string toLowerCase(): 略");
        console.log("string toUpperCase(): 略");
        console.log("string trim(): 略");
        console.log("string valueOf(): 略");
        console.log("HELLO WORLD!!!".toLocaleLowerCase());
        console.log("hello world!!!".toLocaleUpperCase());
        console.log("HELLO WORLD!!!".toLowerCase());
        console.log("hello world!!!".toUpperCase());
        console.log("            hello world!!!        ".trim());
        console.log("hello world!!!".valueOf());
        console.log("\r\n");
    </script>

    <script>
        /*要求：将下列字符串中的"java"用红色字体显示*/

        var str = `Netscape在最初将其脚本语言命名为LiveScript，后来Netscape在与Sun合作之后将其改名为JavaScript。
            JavaScript最初受Java启发而开始设计的，目的之一就是“看上去像Java”，因此语法上有类似之处，一些名称和命名规范也借自Java。
            但JavaScript的主要设计原则源自Self和Scheme。`;

        document.write(str.replace(/(java)/gi, '<span style="color:red">$1</span>'));

        /*解释：必须要开启全局搜索和忽略大小写，否则匹配不到所有的”java”字符*/
    </script>

    <script>
        const name1 = '\u0041\u006d\u00e9\u006c\u0069\u0065';
        const name2 = '\u0041\u006d\u0065\u0301\u006c\u0069\u0065';

        console.log(`${name1}, ${name2}`);
        // expected output: "Amélie, Amélie"
        console.log(name1 === name2);
        // expected output: false
        console.log(name1.length === name2.length);
        // expected output: false

        const name1NFC = name1.normalize('NFC');
        const name2NFC = name2.normalize('NFC');

        console.log(`${name1NFC}, ${name2NFC}`);
        // expected output: "Amélie, Amélie"
        console.log(name1NFC === name2NFC);
        // expected output: true
        console.log(name1NFC.length === name2NFC.length);
// expected output: true

    </script>
</head>
<body>
</body>
</html>